<template>
  <star-horse-dialog :visible = "dialogTableVisible" :title = "dialogTitle" @merge = "merge"
                     @mergeDraft = "mergeDraft"
                     @reset = "resetForm">
    <el-form :model = "ruleForm" :rules = "rules" class = "demo-ruleForm" ref = "ruleForm">
      <el-form-item label = "主键" prop = "idResourcesSummary" v-if = "false">
        <el-input clearable placeholder = "请输入主键"
                  v-model = "ruleForm.idResourcesSummary"></el-input>
      </el-form-item>
      <el-form-item label = "修改人" prop = "updatedBy"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入修改人"
                  v-model = "ruleForm.updatedBy"></el-input>
      </el-form-item>

      <el-form-item label = "修改日期" prop = "updatedDate"
                    v-if = "!true">
        <el-date-picker clearable placeholder = "请选择修改日期" type = "date"
                        v-model = "ruleForm.updatedDate">
        </el-date-picker>
      </el-form-item>

      <el-form-item label = "创建人" prop = "createdBy"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入创建人"
                  v-model = "ruleForm.createdBy"></el-input>
      </el-form-item>

      <el-form-item label = "创建日期" prop = "createdDate"
                    v-if = "!true">
        <el-date-picker clearable placeholder = "请选择创建日期" type = "date"
                        v-model = "ruleForm.createdDate">
        </el-date-picker>
      </el-form-item>

      <el-form-item label = "是否删除 1 是 0否" prop = "isDel"
                    v-if = "!true">
        <el-input-number clearable placeholder = "请输入是否删除 1 是 0否"
                         v-model = "ruleForm.isDel"/>
      </el-form-item>

      <el-form-item label = "状态名称" prop = "statusName"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入状态名称"
                  v-model = "ruleForm.statusName"></el-input>
      </el-form-item>
      <el-form-item label = "系统编号" prop = "dataNo"
                    v-if = "!true">
        <el-input clearable placeholder = "请输入系统编号"
                  v-model = "ruleForm.dataNo"></el-input>
      </el-form-item>
      <el-row>
        <el-col :span = "12">
          <el-form-item label = "系统信息" prop = "informationsSingleId"
                        required v-if = "!false">
            <el-select :disabled = "readonly"
                       @change = "loadMenus"
                       clearable
                       filterable
                       placeholder = "请选择系统信息"
                       v-model = "ruleForm.informationsSingleId">
              <el-option
                  :key = "sitem.idInformations"
                  :label = "sitem.sysName"
                  :value = "sitem.idInformations"
                  v-for = "sitem in informationsSingleIdList"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item label = "菜单信息" prop = "menusList"
                        required v-if = "!false">
            <el-tree-select
                :data = "menuPathList"
                @change = "changeMenusName"
                clearable
                collapse-tags
                filterable
                multiple
                placeholder = "请选择菜单"
                v-model = "ruleForm.menusList"/>

          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span = "12">
          <el-form-item label = "角色信息" prop = "rolesList"
                        required v-if = "!false">
            <el-select @change = "changeMenusName"
                       clearable
                       collapse-tags
                       filterable
                       multiple
                       placeholder = "请选择角色"
                       v-model = "ruleForm.rolesList">
              <el-option
                  :key = "sitem.idRolesinfo"
                  :label = "sitem.roleName"
                  :value = "sitem.idRolesinfo"
                  v-for = "sitem in rolesList"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span = "12">
          <el-form-item required label = "权限" prop = "resourcesPos"
                        v-if = "!false">
            <el-select multiple filterable collapse-tags clearable placeholder = "请选择权限"
                       v-model = "ruleForm.resourcesPos">
              <el-option
                  :key = "sitem.value"
                  :label = "sitem.name+'('+sitem.value+')'"
                  :value = "sitem.value"
                  v-for = "sitem in baseResourcesPos"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label = "状态" prop = "statusCode"
                    v-if = "!false">
        <el-select placeholder = "请选状态" v-model = "ruleForm.statusCode">
          <el-option
              :key = "sitem.statusCode"
              :label = "sitem.statusName"
              :value = "sitem.statusCode"
              clearable
              v-for = "sitem in selectData"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label = "描述" prop = "remark"
                    v-if = "!false">
        <el-input
            maxlength = "1000"
            placeholder = "请输入描述"
            show-word-limit
            type = "textarea"
            v-model = "ruleForm.remark"
        />
      </el-form-item>


    </el-form>
  </star-horse-dialog>
  <star-horse-dialog :visible = "viewVisible" :title = "'查看数据'" :is-view = "true">

    <div class = "item">
      <label>系统信息:</label>
      <div class = "content">{{ ruleForm.informationsPo.sysName }}</div>
    </div>

    <div class = "item">
      <label>菜单信息:</label>
      <div class = "content">
        <template v-for = "item in ruleForm.menusList">
          {{ item.menuName }},
        </template>
      </div>
    </div>

    <div class = "item">
      <label>角色信息:</label>
      <div class = "content">
        <template v-for = "item in ruleForm.rolesList">
          {{ item.roleName }},
        </template>
      </div>
    </div>
    <div class = "item">
      <label>权限:</label>
      <div class = "content">
        <template v-for = "item in ruleForm.resourcesPos">
          {{ item.resName + '(' + item.resCode + ')' }},
        </template>
      </div>
    </div>

    <div class = "item">
      <label>状态:</label>
      <div class = "content">
        {{ ruleForm.statusName }}
      </div>
    </div>


    <div class = "item">
      <label>描述:</label>
      <div class = "content">
        {{ ruleForm.remark }}
      </div>
    </div>
  </star-horse-dialog>
  <el-card class = "inner_content">
    <el-form class = "search_area" size = "mini">
      <el-form-item label = "系统名称">
        <el-select
            clearable
            filterable
            placeholder = "请选择系统名称"
            v-model = "searchForm.informationsSingleId">
          <el-option
              :key = "item.idInformations"
              :label = "item.sysName"
              :value = "item.idInformations"
              v-for = "item in informationsSingleIdList"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label = "添加时间">
        <el-date-picker
            end-placeholder = "结束日期" placeholder = "请选择添加时间"
            range-separator = "到"
            start-placeholder = "开始日期"
            type = "daterange"
            v-model = "searchForm.createdDate"
        />
      </el-form-item>
      <el-form-item label = "     ">
        <el-button @click = "dataSearch" link type = "primary">
          <user-icon icon = "search"/>
          <span style = "vertical-align: middle;"> 查询 </span>
        </el-button>
        <el-button @click = "dataSearch(1)" link small>
          <span style = "vertical-align: middle;"> 重置 </span>
        </el-button>
      </el-form-item>
    </el-form>
    <el-divider/>
    <star-horse-button-list
        :permission = "permission"
        :upload-url = "uploadUrl"
        @upload = "upload"
        @uploadProcess = "uploadProcess"
        @uploadError = "uploadError"
        @uploadSuccess = "uploadProcess"
        @btnOperation = "btnOperation"
    />

    <el-table
        :data = "dataList"
        :row-key = "getRowIdentity"
        @row-dblclick = "editData"
        @selection-change = "handleSelectionChange"
        border
        class = "data_table"
        fit = "true"
        highlight-current-row = "true"
        id = "resourcesPo"
        ref = "multipleTable"
        stripe = "true">
      <el-table-column fixed width = "1"/>
      <el-table-column
          :reserve-selection = "true"
          align = "center"
          fixed = "left"
          type = "selection"
      />
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "主键"
          min-width = "200px"
          prop = "idResourcesSummary"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统名称"
          min-width = "200px"
          prop = "informationsSingleId"
          sortable
          v-if = "true ">
      </el-table-column>


      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "角色名称"
          min-width = "200px"
          prop = "rolesList"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "菜单名称"
          min-width = "200px"
          prop = "menusList"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "权限"
          min-width = "200px"
          prop = "resourcesPos"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改人"
          min-width = "200px"
          prop = "updatedBy"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "修改日期"
          min-width = "200px"
          prop = "updatedDate"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建人"
          min-width = "200px"
          prop = "createdBy"
          sortable
          v-if = " true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "创建日期"
          min-width = "200px"
          prop = "createdDate"
          sortable
          v-if = " true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "是否删除 1 是 0否"
          min-width = "200px"
          prop = "isDel"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态名称"
          min-width = "200px"
          prop = "statusName"
          sortable
          v-if = "true ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "状态编码"
          min-width = "200px"
          prop = "statusCode"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column
          :formatter = "dataFormat"
          :show-overflow-tooltip = "true"
          label = "系统编号"
          min-width = "200px"
          prop = "dataNo"
          sortable
          v-if = " false ">
      </el-table-column>
      <el-table-column fixed = "right" label = "操作" min-width = "180px">
        <template #default = "scope">
          <el-button v-if = "permission.edit" @click = "editById(scope.row)" link title = ""
                     type = "primary">
            <el-tooltip content = "编辑">编辑</el-tooltip>
          </el-button>
          <el-button v-if = "permission.view" @click = "viewById(scope.row[primaryKey])" link title = ""
                     type = "primary">
            <el-tooltip content = "查看">查看</el-tooltip>
          </el-button>
          <el-button v-if = "permission.delete" @click = "deleteById(scope.row[primaryKey])" link title = ""
                     type = "danger">
            <el-tooltip content = "删除">删除</el-tooltip>
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-divider/>
    <el-pagination
        :total = "totalData"
        @current-change = "pageChangeClick"
        @size-change = "pageSizeClick"
        layout = "total, sizes, prev, pager, next, jumper"
        v-model:currentPage = "currentPage"
        v-model:page-size = "pageSize"
        v-model:pageCount = "totalPage"/>
  </el-card>
</template>
<style>

</style>
<script>
import {error} from "../../utils/message";
import {loadConfigedMenus, loadRoleDatas, loadSystems, selectMenusTreeData} from "../../api/star_horse";
import {common} from "../../api/common";
import {ref} from "vue";

export default {
  name: "ResourcesEntity",
  mixins: [common],
  setup() {
    return {}
  },
  data() {
    const loadByPageUrl = ref("/system-config/system/resourcesSummaryEntity/pageList");
    const mergeUrl = ref("/system-config/system/resourcesSummaryEntity/merge");
    const mergeDraftUrl = ref("/system-config/system/resourcesSummaryEntity/mergeDraft");
    const batchMergeUrl = ref("/system-config/system/resourcesSummaryEntity/mergeBatch");
    const batchMergeDraftUrl = ref("/system-config/system/resourcesSummaryEntity/mergeBatchDraft");
    const loadByIdUrl = ref("/system-config/system/resourcesSummaryEntity/getById");
    const uploadUrl = ref("/system-config/system/resourcesEntity/importData");
    const deleteUrl = ref("/system-config/system/resourcesSummaryEntity/batchDeleteById");
    const exportAllUrl = ref("/system-config/system/resourcesSummaryEntity/exportData");
    const downloadTemplateUrl = ref("/system-config/system/resourcesSummaryEntity/downloadTemplate");
    const primaryKey = "idResourcesSummary";
    return {
      loadByPageUrl,
      mergeUrl,
      mergeDraftUrl,
      batchMergeUrl,
      batchMergeDraftUrl,
      loadByIdUrl,
      uploadUrl,
      deleteUrl,
      exportAllUrl,
      downloadTemplateUrl,
      primaryKey,
      baseResourcesPos: [],
      menuPathList: [],
      informationsSingleIdList: [],
      readonly: false,
      rules: {
        informationsSingleId: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        menusList: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        rolesList: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        resName: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        resCode: [{required: true, message: "必选项不能为空", trigger: "blur"}],
        resourcesPos: [{required: true, message: "必选项不能为空", trigger: "blur"}],
      }
    }
  },
  methods: {
    handleAddDetails(row, type) {
      if (!this.ruleForm.resourcesPos) {
        this.ruleForm["resourcesPos"] = [];
      }
      if (type === 1) {
        let obj = {};
        this.ruleForm["resourcesPos"].push(obj);
      } else {
        this.ruleForm["resourcesPos"].splice(row.xh - 1, 1);
      }
    },
    editById(row) {
      this.resetForm();
      this.readonly=true;
      this.dialogTitle = "编辑数据";
      this.loadById(row[this.primaryKey]);
      this.ruleForm["informationsSingleId"]=row["informationsSingleId"];
      this.loadMenus();
    },
    /**
     * 根据系统加载菜单
     * */
    loadMenus() {
      let that = this;
      let query = [];
      that.ruleForm["menuNames"] = [];
      query.push({
        "propertyName": "informationsSingleId",
        "value": that.ruleForm.informationsSingleId
      })
      loadConfigedMenus(query).then(res => {
        that.menuPathList = selectMenusTreeData(res.data.data);
      }).catch(err => {
        error(err);
      });

    },

    dataFormat(row, column, cellValue, index) {
      cellValue = this.commonDataFormat(row, column, cellValue, index);

      let names = [];
      if (column.property == "rolesList") {
        row.rolesList.forEach(item => names.push(item.roleName));
        return names.toLocaleString();
      }
      if (column.property == "menusList") {
        row.menusList.forEach(item => names.push(item.menuName));
        return names.toLocaleString();
      }
      if (column.property == "informationsSingleId") {
        return row.informationsPo.sysName;
      }
      if (column.property == "resourcesPos") {
        row.resourcesPos.forEach(item => names.push(item.resName));
        return names.toLocaleString();
      }

      return cellValue;

    },
    /**
     * 重写公共方法
     */
    addDataFun() {
      this.ruleForm = {};
      this.dialogTableVisible = !this.dialogTableVisible;
      this.dialogTitle = "新增数据";
    },
    /**
     * 初始化数据
     */
    init: function () {
      let _this = this;
      _this.dataList = [];
      _this.selectData = [];
      _this.loadByPage(_this.currentPage, _this.pageSize);
      _this.loadPermissionResources();
      _this.loadSelectData();
      _this.informationsSingleIdListFun();
      _this.loadRolesData();
      //单位
      _this.commonSelectData("button_authority", function (data) {
        _this.baseResourcesPos = [];
        if (data) {
          data.forEach(item => _this.baseResourcesPos.push({name: item.statusName, value: item.statusCode}));
        }
      });
    },
    loadRolesData() {
      let that = this;
      let query = [];
      loadRoleDatas(query).then(res => {
        that.rolesList = res;
      }).catch(err => {
        error(err);
      });
    },
    /**
     * 系统信息
     */
    informationsSingleIdListFun() {
      let that = this;
      let query = [];
      loadSystems(query).then(res => {
        that.informationsSingleIdList = res;
      }).catch(err => {
        error(err);
      });
    }
    ,

    /**
     * 状态码数据
     */
    loadSelectData() {
      this.commonSelectData("sys_resources");
    }
    ,

    parseSearchData: function () {
      let data = this.searchForm;
      let arr = [];
      if (data.informationsSingleId) {
        arr.push({
          propertyName: "a.informationsSingleId",
          value: data.informationsSingleId
        });
      }

      if (data.createdDate) {
        arr.push({
          propertyName: "a.createdDate",
          value: data.createdDate,
          operation: "bt"
        });
      }
      return arr;
    }
  },
  created() {
    this.init();
  }
}
</script>